<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    /*#d{*/
    /*  height: 100px;*/
    /*  width: 100px;*/
    /*  background-color: #2a8f3b;*/
    /*}*/
    .dc{
        color: aqua;
    }
    .db{
        color: blueviolet;
    }
  </style>
</head>
<body>
                        <!--使用js改样式-->
 <div id="d"  class="dc">sakjdkjhs</div>
 <button type="button" onclick="abc()">按钮</button>

 <script>

       //通过style标签直接修改属性
   // function abc(){
   //   var d =document.getElementById('d')
   //   d.style.color='#3435b0'
   // }

    function abc(){
        var dc =document.getElementsByClassName('dc')
        dc.className ='db'
    }
 </script>
</body>
</html>